SVG DOM topic

Support for modifying elements of an SVG asset programmatically, using a document object model. An SVG asset can be animated by repeatedly modifying the DOM representation, and displaying the new ScalableImage created from it after each frame. This is similar to what some web pages do with JavaScript code modifying an SVG.

Sample Usage:

final String svgSrc = 
    '<svg><circle id="foo" cx="5" cy="5" r="5" fill="green"/></svg>';
final svg = SvgDOMManager.fromString(svgSrc);
final node = svg.dom.idLookup['foo'] as SvgEllipse;
node.paint.fillColor = Colors.blue;
final ScalableImage si = svg.build();
   ... display si, perhaps in a ScalableImageWidget ...

A full sample can be found in the GitHub repository in example/lib/animation.dart.

Here's a UML diagram overview of the DOM class structure:

Classes

Affine SVG DOM
Affine matrix, used to represent scale, translate and other transformations applied to e.g. an SVG node. Attaching an affine matrix to a node is equivalent to calling dart:ui's Canvas.transform method.
Affine SVG DOM
Affine matrix, used to represent scale, translate and other transformations applied to e.g. an SVG node. Attaching an affine matrix to a node is equivalent to calling dart:ui's Canvas.transform method.
MutableAffine SVG DOM
An mutable version of an Affine matrix.
MutableAffine SVG DOM
An mutable version of an Affine matrix.
ParseError SVG DOM
Exception thrown when there is a problem parsing See PathParser.parse.
ParseError SVG DOM
Exception thrown when there is a problem parsing See PathParser.parse.
PathBuilder SVG DOM
A builder of a path whose source is a SVG path element. A PathParser calls methods on an implementor of PathBuilder as it parses the components of an SVG path.
PathBuilder SVG DOM
A builder of a path whose source is a SVG path element. A PathParser calls methods on an implementor of PathBuilder as it parses the components of an SVG path.
PathParser SVG DOM
Parse an SVG Path. The path syntax is specified at at https://www.w3.org/TR/2018/CR-SVG2-20181004/paths.html
PathParser SVG DOM
Parse an SVG Path. The path syntax is specified at at https://www.w3.org/TR/2018/CR-SVG2-20181004/paths.html
StringPathBuilder SVG DOM
A PathBuilder that produces a path string. This can be used with a PathParser if you have a path string that you want to parse, modify, and then reconstitute as a path string.
StringPathBuilder SVG DOM
A PathBuilder that produces a path string. This can be used with a PathParser if you have a path string that you want to parse, modify, and then reconstitute as a path string.
Style SVG DOM
An entry in the list of styles for a given element type or node ID in a Stylesheet.
Style SVG DOM
An entry in the list of styles for a given element type or node ID in a Stylesheet.
SvgColor SVG DOM
Color as SVG knows it, plus alpha in the high-order byte (in case we encounter an SVG file with an (invalid) eight-character hex value).
SvgColor SVG DOM
Color as SVG knows it, plus alpha in the high-order byte (in case we encounter an SVG file with an (invalid) eight-character hex value).
SvgCoordinate SVG DOM
A coordinate in a gradient color. A coordinate can be a pixel value or a percentage.
SvgCoordinate SVG DOM
A coordinate in a gradient color. A coordinate can be a pixel value or a percentage.
SvgCustomPath SVG DOM
An SVG node that lets the client specify the Path directly. This can be used with the SVG DOM API, by programmatically creating an instance of this node, and inserting it into an SVG DOM, either in a SvgGroup or into SvgDOM.root.
SvgCustomPath SVG DOM
An SVG node that lets the client specify the Path directly. This can be used with the SVG DOM API, by programmatically creating an instance of this node, and inserting it into an SVG DOM, either in a SvgGroup or into SvgDOM.root.
SvgDefs SVG DOM
An SVG definitions node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/struct.html#DefsElement .
SvgDefs SVG DOM
An SVG definitions node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/struct.html#DefsElement .
SvgDOM SVG DOM
A document object model representing an asset that can be turned into a ScalableImage. Normally this is obtained by parsing an SVG XML file (or, internally, by parsing an Android AVD XML file). See also SVGDomManager.
SvgDOM SVG DOM
A document object model representing an asset that can be turned into a ScalableImage. Normally this is obtained by parsing an SVG XML file (or, internally, by parsing an Android AVD XML file). See also SVGDomManager.
SvgDOMManager SVG DOM
Support for loading an SVG asset, manipulating it, and producing ScalableImage instances from the asset's current state. This is the entry point for use of the dom library.
SvgEllipse SVG DOM
An SVG ellipse or circle. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#EllipseElement and https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#CircleElement .
SvgEllipse SVG DOM
An SVG ellipse or circle. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#EllipseElement and https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#CircleElement .
SvgFontSize SVG DOM
Font size for SVG text. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontPropertiesUsedBySVG .
SvgFontSize SVG DOM
Font size for SVG text. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontPropertiesUsedBySVG .
SvgFontWeight SVG DOM
The value of an SVG font weight attribute. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontWeightProperty .
SvgFontWeight SVG DOM
The value of an SVG font weight attribute. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontWeightProperty .
SvgGradientColor SVG DOM
A gradient color. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGradientColor SVG DOM
A gradient color. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGradientNode SVG DOM
A node in an SVG asset that defines an SvgGradientColor. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGradientNode SVG DOM
A node in an SVG asset that defines an SvgGradientColor. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGradientStop SVG DOM
And SVG gradient stop. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGradientStop SVG DOM
And SVG gradient stop. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgGroup SVG DOM
An SVG g node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/struct.html#Groups .
SvgGroup SVG DOM
An SVG g node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/struct.html#Groups .
SvgImage SVG DOM
An SVG image. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#ImageElement .
SvgImage SVG DOM
An SVG image. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#ImageElement .
SvgInheritableAttributes SVG DOM
Attributes of an SVG element that are inherited from an ancestor node. These attributes are also present in Style instances.
SvgInheritableAttributes SVG DOM
Attributes of an SVG element that are inherited from an ancestor node. These attributes are also present in Style instances.
SvgInheritableAttributesNode SVG DOM
Common supertype of nodes that can contain the attributes that are inherited by children.
SvgInheritableAttributesNode SVG DOM
Common supertype of nodes that can contain the attributes that are inherited by children.
SvgInheritableTextAttributes SVG DOM
Attributes of an SVG element that are inherited from an ancestor node, and that are also present in an SvgTextSpan within an SVG text element..
SvgInheritableTextAttributes SVG DOM
Attributes of an SVG element that are inherited from an ancestor node, and that are also present in an SvgTextSpan within an SVG text element..
SvgLinearGradientColor SVG DOM
An SVG linear gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients
SvgLinearGradientColor SVG DOM
An SVG linear gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients
SvgMask SVG DOM
An SVG mask. See https://www.w3.org/TR/2011/REC-SVG11-20110816/masking.html#MaskElement .
SvgMask SVG DOM
An SVG mask. See https://www.w3.org/TR/2011/REC-SVG11-20110816/masking.html#MaskElement .
SvgNode SVG DOM
Common supertype for all nodes in an SVG DOM graph.
SvgNode SVG DOM
Common supertype for all nodes in an SVG DOM graph.
SvgPaint SVG DOM
Parameters used to control the painting of an SVG node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html .
SvgPaint SVG DOM
Parameters used to control the painting of an SVG node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html .
SvgPath SVG DOM
An SVG path. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/paths.html#PathElement .
SvgPath SVG DOM
An SVG path. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/paths.html#PathElement .
SvgPoly SVG DOM
An SVG line, polyline or polygon. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#LineElement , https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#PolylineElement , or https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#PolygonElement .
SvgPoly SVG DOM
An SVG line, polyline or polygon. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#LineElement , https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#PolylineElement , or https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#PolygonElement .
SvgRadialGradientColor SVG DOM
An SVG radial gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgRadialGradientColor SVG DOM
An SVG radial gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgRect SVG DOM
An SVG rect element. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#RectElement .
SvgRect SVG DOM
An SVG rect element. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/shapes.html#RectElement .
SvgRoot SVG DOM
The root node of an SvgDOM.
SvgRoot SVG DOM
The root node of an SvgDOM.
SvgSweepGradientColor SVG DOM
An SVG sweep gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgSweepGradientColor SVG DOM
An SVG sweep gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SvgSymbol SVG DOM
An SVG symbol. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#SymbolElement .
SvgSymbol SVG DOM
An SVG symbol. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#SymbolElement .
SvgText SVG DOM
An SVG text node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgText SVG DOM
An SVG text node. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpan SVG DOM
An SVG tspan. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpan SVG DOM
An SVG tspan. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpanComponent SVG DOM
A component of an SVG tspan. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpanComponent SVG DOM
A component of an SVG tspan. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpanStringComponent SVG DOM
A string run within an SVG text. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextSpanStringComponent SVG DOM
A string run within an SVG text. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SvgTextStyle SVG DOM
Text styling information for an SVG asset. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontPropertiesUsedBySVG .
SvgTextStyle SVG DOM
Text styling information for an SVG asset. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html#FontPropertiesUsedBySVG .
SvgUse SVG DOM
An SVG use. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#UseElement .
SvgUse SVG DOM
An SVG use. See https://www.w3.org/TR/2011/REC-SVG11-20110816/struct.html#UseElement .

Enums

SIBlendMode SVG DOM
Possible blend mode values used when painting a node. This is analagous to BlendMode in dart:ui.
SIBlendMode SVG DOM
Possible blend mode values used when painting a node. This is analagous to BlendMode in dart:ui.
SIFillType SVG DOM
Possible fill type values for a paint object. This is analogous to PathFillType in dart:ui.
SIFillType SVG DOM
Possible fill type values for a paint object. This is analogous to PathFillType in dart:ui.
SIFontStyle SVG DOM
Possible font styles.
SIFontStyle SVG DOM
Possible font styles.
SIGradientSpreadMethod SVG DOM
Possible spread methods for a color gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SIGradientSpreadMethod SVG DOM
Possible spread methods for a color gradient. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/painting.html#Gradients .
SIStrokeCap SVG DOM
Possible stroke cap values for a paint object. This is analagous to StrokeCap in dart:ui.
SIStrokeCap SVG DOM
Possible stroke cap values for a paint object. This is analagous to StrokeCap in dart:ui.
SIStrokeJoin SVG DOM
Possible stroke join values for a paint object. This is analagous to StrokeJoin in dart:ui.
SIStrokeJoin SVG DOM
Possible stroke join values for a paint object. This is analagous to StrokeJoin in dart:ui.
SITextAnchor SVG DOM
Text anchor values. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SITextAnchor SVG DOM
Text anchor values. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SITextDecoration SVG DOM
Text decoration values. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SITextDecoration SVG DOM
Text decoration values. See https://www.w3.org/TR/2008/REC-SVGTiny12-20081222/text.html .
SITintMode SVG DOM
Possible tint mode values for an asset. This is a top-level property for an asset that is not present in an SVG; it comes from Android Vector Drawables. It determines the dart:ui BlendMode used to apply a tint,
SITintMode SVG DOM
Possible tint mode values for an asset. This is a top-level property for an asset that is not present in an SVG; it comes from Android Vector Drawables. It determines the dart:ui BlendMode used to apply a tint,

Typedefs

Stylesheet = Map<String, List<Style>> SVG DOM
A stylesheet is a map from a tagName or a node ID to a list of Style instances. A tagName is like "tspan" or "", and an ID starts with "#". The Style instances will be in the order they were encountered in the SVG source file.
Stylesheet = Map<String, List<Style>> SVG DOM
A stylesheet is a map from a tagName or a node ID to a list of Style instances. A tagName is like "tspan" or "", and an ID starts with "#". The Style instances will be in the order they were encountered in the SVG source file.